<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText" @tap="onreturn()">返回</block>
			<block slot="content">统计</block> 
		</cu-custom> 
			 
		<echarts :option="option" style="height: 300px;" @click="echartsClick"></echarts>
		<!-- <echarts-el :option="option" style="height: 300px;"></echarts-el> --> 
	</view>
</template>

<script>
	import Echarts from '@/components/echarts/echarts.vue'
	import EchartsEl from '@/components/echarts/echarts-el.vue'
	export default {
		data() {
			return {
				option: {},
				xData: [],
				seriesData: [], 
				option3: {
					notMerge: true, // 自定义变量：true代表不合并数据，比如从折线图变为柱形图则需设置为true；false或不写代表合并
					tooltip: {
						trigger: 'axis',
						positionStatus: true,
						formatterStatus: false, // 自定义变量：是否格式化tooltip，设置为false时下面三项均不起作用
						formatterUnit: '', // 自定义变量：数值后面的单位
						formatFloat2: true, // 自定义变量：是否格式化为两位小数
						formatThousands: true // 自定义变量：是否添加千分位
					},
					xAxis: {
						type: 'category',
						data: []
					},
					yAxis: {
						type: 'value'
					},
					series: [{
						data: [],
						type: 'bar',
						showBackground: true,
						backgroundStyle: {
							color: 'rgba(220, 220, 220, 0.8)'
						}
					}]
				}
			};
		},
		components: {
			Echarts,
			EchartsEl
		},
		onReady() {
			var _self = this;

			//商品集合 
			uniCloud.callFunction({
				name: "get_goodinfo",
				data: {}
			}).then((res) => {
				const {
					result
				} = res

				for (var i = 0; i < result.data.length; i++) {
					var name = result.data[i].name;
					var num = result.data[i].num;
					_self.xData.push(name);
					_self.seriesData.push(parseInt(num));
				}
				_self.option3.xAxis.data = _self.xData;
				_self.option3.series[0].data = _self.seriesData
				//_self.option = _self.option3
				_self.option = _self.option3
			});

		},
		onLoad() {
			this.loaddata();
		},
		methods: {
			 
			loaddata() {
				this.option = this.option3
			},
			/**
			 * 点击事件
			 * @param {Object} params
			 */
			echartsClick(params) {
				console.log('点击数据', params)
			},
			 
		}
	};
</script>

<style></style>
